import { NavBar, List, Button } from "antd-mobile";
import React from "react";
import "./UserCenter.less";

export default function UserCenter() {
    return (
        <div className="user-container">
            <NavBar back={null}>个人中心</NavBar>
            <div className="h-50"></div>

            {/* 头像部分 start */}
            <div className="profile">
                <img src="/images/xiaohigh.webp" alt="" />
                <p>欢迎, 用户 xiao-high</p>
            </div>
            {/* 头像部分 end */}

            {/* 个人中心 start */}
            <div className="info">
                <List>
                    <List.Item><span>昵称</span><span>xiao-high</span></List.Item>
                    <List.Item><span>手机号</span><span>15986593254</span></List.Item>
                </List>
            </div>
            {/* 个人中心 end */}
            <div className="h-50"></div>
            <Button block color="danger" size="large">退出登录</Button>
        </div>
    );
}
